<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html style="height: 100%">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<title></title>
</head>
<body style="height: 100%; margin: 0">
	<div id="container" style="height: 100%"></div>
	<script src="/lib/jquery.min.js"></script>
	<script type="text/javascript"
		src="http://echarts.baidu.com/gallery/vendors/echarts/echarts.min.js"></script>
	<script src="${pageContext.request.contextPath}/js/tools.js"></script>

	<script type="text/javascript">
		var list_data = new Array();
		var getData = gb.XHR({
			url : "/data/list?page=1&limit=100",
			queryParams : {},
			type : "GET",
			contentType : "application/x-www-form-urlencoded",
			isAsync : false,
			callback : function(data) {
				if (data.code == 0) {
					for (var i = 0; i < data.data.length; i++) {
						if(data.data[i].year !="" && data.data[i].money!= ""){
							list_data.push([ data.data[i].year, data.data[i].money])
						}
					}
				} else {
					layer.msg('数据接口异常', {
						time : 1500
					});
				}
			}
		});
		console.log(list_data);
		var dom = document.getElementById("container");
		var myChart = echarts.init(dom);
		var app = {};
		option = null;
		option = {
			title : {
				text : '散点图',
				right : '50%'
			},
			xAxis : {
				name : '贷款时间/年',
				nameLocation : 'center',
				type : 'value',
				min :'dataMin',
				max :'dataMax'
			},
			yAxis : {
				name : '贷款金额/万元',
				nameLocation : 'end',
				type : 'value',
				min :'dataMin',
				max :'dataMax'
			},
			series : [ {
				symbolSize : 20,
				data :list_data,
				type : 'scatter'
			} ]
		};
		;
		if (option && typeof option === "object") {
			myChart.setOption(option, true);
		}
	</script>
</body>
</html>